.auth {
	background-color:rgba(0, 0, 0, 0);
	padding: 30px 8% 0 8%;


	#logo{
		text-align:center;
		margin-bottom: $content-padding * 3;
		img{width:50%;max-width:200px;}
		h1{
			color:$light;
			letter-spacing:3px;
			margin-top: $content-padding;
			font-size: $font-size-large;
		}
	}

	.item{
		margin-bottom:20px;
		border-width:0;
		background-color: rgba($black,0.1);
		input{
			margin-left: 50px;
		}
		
		.icon{
			color:$light;
			font-size: 30px;
			margin-right:6px;
			&:first-child{
				position: absolute;
				top: 0;
				left: 0;
				width: 50px;
				text-align: center;
				background: rgba($black,0.1);
				bottom: 0;
			}
		}
		.button-last{
			position: absolute;
			top: 0;
			right: 0; 
			line-height: inherit;
		}
	}
	.alpha-dark {
		input{
			color:$stable;
			&::-webkit-input-placeholder { 
				color:$light3; 
			} 
		}
	}
	.expend{
    	letter-spacing: $content-padding;
    	text-indent: $content-padding;
    }
    .button-clear{
    	color:$light;
    	&.activated{
    		background-color:rgba($black,0.2);
    	}
    }
}



canvas {
  display: block;
  vertical-align: bottom;
}

.auth-bg{
	position: absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
	background-image:url("../img/bg1.jpg");
	background-size: cover;
	background-position:50%;
}

.particleJs{
	width: 100%;
	height: 100%;
}